<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <title>{% block title %}Welcome!{% endblock %}</title>
        {% block stylesheets %}{% endblock %}
        <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:regular,medium,thin,italic,mediumitalic,bold" title="roboto">
        <link href="{{ asset('bundles/front/css/main.css') }}" rel="stylesheet" type="text/css" />
        <link href="{{ asset('bundles/front/css/home.css') }}" rel="stylesheet" type="text/css" />
        <link rel="shortcut icon" href="{{ asset('favicon.ico') }}" />
        <link type="text/css" href="{{ asset('bundles/front/css/optimus/jquery-ui-1.8.21.custom.css') }}" rel="stylesheet" />
        <!-- BASIC JAVASCRIPT -->
        <script type="text/javascript" src="{{ asset('bundles/front/js/jquery-1.7.2.min.js') }}"></script>
        <script type="text/javascript" src="{{ asset('bundles/front/js/jquery-ui-1.8.21.custom.min.js') }}"></script>
        <script type="text/javascript" src="{{ asset('bundles/front/js/carousel.js') }}"></script>
        <script type="text/javascript">
            
       $(function() {
      
              $( "#download_button" ).button().click(function() 
              {
                  alert("dsa");
               });
               // Dialog Link
                                $('#download_link').button().click(function(){
                                    alert("dsa");    
                                });
       });
            </script>
            <style type="text/css">
			/*demo page css*/
			
                        #download_link {padding: .4em 1em .4em 20px;text-decoration: none;position: relative; color: #ffffff; }
			#download_link span.ui-icon {margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px;}
			
		</style>
        </head>
        <body>
            
          
<div class="container">
  <div class="header"><a href="#"><img src="" alt="Insertar logotipo aquí" name="Insert_logo" width="20%" height="90" id="Insert_logo" style="background: #8090AB; display:block;" /></a> 
      <h4>link 1</h4>
    <!-- end .header --></div>
  <div class="content">
    <h1>Instrucciones</h1>
    
                                <!-- Slideshow -->
                                <div class="slideshow-container slideshow-home col-16" style="position: relative; z-index: 2; left: 0px; width: 940px; ">
                                    <a href="" class="slideshow-prev">Prev</a>
                                    <a href="" class="slideshow-next">Next</a>
                                    <div class="frame">
                                        <ul style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; position: relative; list-style-type: none; z-index: 1; width: 3760px; left: -2820px; ">
                                            <li class="item carousel-home" style="float: left; width: 940px; height: 500px; ">
                                                <div class="content-left col-9">
                                                    <a href="/about/versions/jelly-bean.html"><img src="{{ asset('bundles/front/images/home/android-jellybean.png') }}"></a>
                                                </div>
                                                <div class="content-right col-6">
                                                    <h1>Descarga iKarta ahora</h1>
                                                    <p>iKarta es el siguiente paso evolutivo para los restaurantes que están buscando para aumentar 
                                                        la conciencia y lealtad del cliente, y ofrecer a sus valiosos clientes de una manera moderna 
                                                        e interactiva para pedir comida, así como recibir un servicio personalizado e interactivo.</p>
                                                    <p><a href="/about/versions/jelly-bean.html" class="button"> Leer más...</a></p>
                                                </div>
                                            </li>
                                            <li class="item carousel-home" style="float: left; width: 940px; height: 500px; ">
                                                <div class="content-left col-10">
                                                    <img src="{{ asset('bundles/front/images/home/design.png') }}" style="margin-top:30px">
                                                </div>
                                                <div class="content-right col-5">
                                                    <h1>Reemplazar a los menús de papel estándar<br>look great</h1>
                                                    <p>iPads y tabletas pueden reemplazar a los menús de papel estándar que le permite administrar los elementos y características con facilidad. Garantizado aumento en sus números de abajo de la línea!.</p>
                                                    <a href="#" class="big button" >Descargar</a>
                                                </div>
                                            </li>
                                            <li class="item carousel-home" style="float: left; width: 940px; height: 500px; ">
                                                <div class="content-left col-10">
                                                    <img src="{{ asset('bundles/front/images/home/google-io.png') }}">
                                                </div>
                                                <div class="content-right col-5">
                                                    <h1>Watch Android at <br>Google I/O!</h1>
                                                    <p>See the keynote and more than 40 Android developer sessions streamed live from Moscone Center in San Francisco.</p>
                                                    <p>Begins June 27, 9AM PDT (UTC-7).</p>
                                                    <p><a href="https://developers.google.com/events/io/sessions#android" class="button">See the Android Sessions</a></p>
                                                </div>
                                            </li>
                                            <li class="item carousel-home" style="float: left; width: 940px; height: 500px; ">
                                                <div class="content-left col-10">
                                                    <img src="{{ asset('bundles/front/images/home/google-play.png') }}" style="margin-top:50px">
                                                </div>
                                                <div class="content-right col-5">
                                                    <h1>Publish your apps<br>in Google Play</h1>
                                                    <p>The most visited store in the world for Android apps. Cloud-connected and always synced, it's never been easier for users to find and download your apps.</p>

                                                    <p><a href="/distribute/index.html" class="button">Learn More</a></p>
                                                </div> 
                                            </li>
                                        </ul>
                                    </div>

                                    <!-- /End slideshow -->
    <!-- end .content --></div>
                                </div>
  <div class="footer">
    <p>Este .footer contiene la declaración position:relative; para dar a Internet Explorer 6 hasLayout para .footer y provocar que se borre correctamente. Si no es necesario proporcionar compatibilidad con IE6, puede quitarlo.</p>
    <!-- end .footer --></div>
  <!-- end .container --></div>

                
                <script type="text/javascript">
    $('.slideshow-container').dacSlideshow({
        btnPrev: '.slideshow-prev',
        btnNext: '.slideshow-next'
    });
                    </script>
                    <!-- end body-content -->
        {% block body %}{% endblock %}
        {% block javascripts %}{% endblock %}
            </body>
        </html>
